#{extends 'layout.html' /}
#{set title:messages.get('plan.creacion1') /}

<div id="crudList" class="${type.name}">
	
	<h2 id="crudListTitle">${title}</h2>
	
	#{form @Plans.newPlan2()}
		
		#{field 'pacienteId'}
			<input type="hidden" name="${field.name}" value="${pacienteId}"/>
		#{/field}
		
		#{field 'caloriasDiarias'}
			<div class="crudField crud_number">
				<label for="${field.id}">
					&{'plan.caloriasDiarias'}
				</label>
				<input id="${field.id}" class="${field.errorClass}" type="text" name="${field.name}" value="${caloriasDiarias}" size="10" maxlength="5"/>
				#{ifError field.name}
					<span class="error">&{'crud.help.range', '500', '10000'}</span>
				#{/ifError}
				<span class="crudHelp">
					&{'formato.numero'}
				</span>
			</div>
		#{/field}
		
		<input type="hidden" id="tiposPlan" name="tiposPlan" value=""/>
		
		<div class="tiposPlan">
			#{list items:tiposPlan, as:'tipoPlan' }
				<div id="tipoPlan_${tipoPlan}" class="tipoPlan" onclick="checkearTipoPlan('${tipoPlan}')">
					<span>
						<input id="${tipoPlan}" value="${tipoPlan.name()}" type="checkbox" disabled="disabled"/>
						<label style="display: inline; float: none;">${tipoPlan.toString()}</label>
					</span>
					<div>
						<img class="imagenPlan" alt="${tipoPlan.toString()}" src="/public/images/${tipoPlan.imagePath}" title="${tipoPlan.toString()}"/>
					</div>
				</div>
			#{/list}
		</div>
		<div>
			<input type="submit" class="btn" value="Siguiente" onclick="submittearPlanPaso1();" />
		</div>
		
	#{/form}
	
	<div id="crudListAdd" class="btn">
		<a href="@{Plans.newPlanManual(pacienteId, caloriasDiarias)}">
			&{'plan.creacionManual'}
		</a>
	</div>
</div>
